<!--
  Generated template for the MainPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar hideBackButton="true" color="mainColor">
    <!-- <ion-buttons start>
      <button ion-button icon-only (click)="message()">
        <ion-icon name="ios-notifications"></ion-icon>
      </button>
    </ion-buttons> -->
    <ion-title start>泛课堂</ion-title>
    <!-- <ion-buttons end>
      <button ion-button icon-only (click)="personalCentre()">
        <ion-icon name="md-person"></ion-icon>
      </button>
    </ion-buttons> -->
  </ion-navbar>

</ion-header>


<ion-content>
  <ion-refresher (ionRefresh)="doRefresh($event)">
    <ion-refresher-content pullingIcon="arrow-dropdown" pullingText="下拉刷新" refreshingSpinner="circles" refreshingText="努力刷新数据中...">
    </ion-refresher-content>
  </ion-refresher>
  <ion-list>
    <div class="list" [ngClass]="{'padding_bottom': padding }">
      <ul *ngIf="courseList">
        <ion-item-sliding *ngFor="let item of courseList;let i=index">
          <ion-item>
            <li [class]="'bg-'+(i%3+1)">
              <!--              (click)="UnitList(item.classCourseId,item.teacherId,item.className)"-->
              <div class="course-info">
                <p style="overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
                  {{item.name}}
                </p>
                <p>
                  <!--                  <span>
                    {{item.teacherName}}
                  </span>-->
                  <span>
                    {{item.classname}}
                  </span>
                </p>
              </div>
              <div class="course-code">
                <div>
                  <p>
                    <span>{{item.used_class_num}}</span>
                  </p>
                  <!-- <p  *ngIf="item.courseType=='hot'">
                    <span> 授课记录：{{item.unitName}}</span>
                  </p> -->
                </div>
                <ion-icon name="arrow-forward"></ion-icon>
              </div>
            </li>
          </ion-item>
          <ion-item-options>
            <button (click)="ViewUnitList(item.courseclassid,item.courseid,1,item.name,item.used_class_num,item.teacherId,item.courseType,item.is_startcourse,item.unitId)"><span
                *ngIf="item.courseType=='hot'&&item.is_startcourse==0">继续授课</span><span *ngIf="item.courseType!='hot'||item.is_startcourse!=0">授课</span></button>
            <button>备课</button>
            <button>学生</button>
            <button>统计</button>
          </ion-item-options>
        </ion-item-sliding>
      </ul>
      <span *ngIf="!courseList">暂无数据</span>
      <ion-infinite-scroll (ionInfinite)="doInfinite($event)" threshold="50px" *ngIf="noMoreFlag==0">
        <ion-infinite-scroll-content loadingSpinner="bubbles" loadingText="加载更多">
        </ion-infinite-scroll-content>
      </ion-infinite-scroll>
      <span *ngIf="noMoreFlag==1">没有更多了</span>
      <!--<ion-infinite-scroll ng-if="hasMore()" on-infinite="loadMore()" distance="1%"></ion-infinite-scroll>-->
    </div>
  </ion-list>
</ion-content>

<ion-footer>
  <div class="NavList">
    <ul>
      <li>
        <ion-icon ios="ios-book-outline" md="ios-book-outline"></ion-icon>
        <span>课程</span>
      </li>
      <li (click)="message()">
        <ion-icon ios="ios-chatbubbles-outline" md="ios-chatbubbles-outline"></ion-icon>
        <span>消息</span>
      </li>
      <li>
        <ion-icon ios="ios-cloud-outline" md=" ios-cloud-outline">
        </ion-icon>
        <span>资源</span>
      </li>
      <li (click)="personalCentre()">
        <ion-icon ios="ios-person-outline" md="ios-person-outline"></ion-icon>
        <span>我的</span>
      </li>
    </ul>
  </div>
</ion-footer>
